﻿
<script>
    $(document).ready(function () {
        var t = $('#UserList').dataTable({
            "serverSide": true,displayLength:8,
            "ajax": {
                "url": "@Url.Action("GetPaged", "User")",
                "type": "POST"
            },
            select: { style: 'single', selector: 'td:first-child' },
            "columnDefs": [{ sDefaultContent: '', aTargets: ['_all'] }],
            columns: [
                { title: '', data: null, sortable: false, width: 30, "sClass": 'checkColumn select-checkbox' },
                { title: '账号', data: 'userName', width: 70, "sClass": "center" },
                { title: "姓名", data: 'person.fullName', width: 160, "sClass": "left" },
                {
                    title: "性别", data: 'person.genderCode', render: function (data, type, row, meta) {
                        var genderCode;
                        if (row.person) genderCode = row.person.genderCode;
                        else genderCode = "";
                        return app.code2Text("Gender", genderCode);
                    },
                    "sClass": "left"
                }
            ]
        });
    });
    var selectBoxViewModel = function () {
        var self = this;
        self.selectThis = function (datalistControl, event) {

            var data = $("#" + datalistControl).DataTable().rows({ selected: true }).data();
            if (data.length === 0) {
                window.app.message("请选中一项。");
                event.preventDefault();
                event.stopPropagation();
                return;
            }
            var row = data[0];
            var $selectTextControl = $("#@ViewBag.SelectTextControl");
            var $triggerControl = $("#" + $selectTextControl.attr("id") + "Trigger");
            var valueField = $triggerControl.data("valuefield");

            $selectTextControl.val(row.userName);
            $("#" + valueField).val(row.id);

            //触发控件的change事件
            $selectTextControl.change();
            $selectTextControl.valid(); 
        }
        self.empty = function (datalistControl) {
             var $selectTextControl = $("#@ViewBag.SelectTextControl");
            var $triggerControl = $("#" + $selectTextControl.attr("id") + "Trigger");
            var valueField = $triggerControl.data("valuefield");

            $selectTextControl.val("");
            $("#" + valueField).val("");


            $selectTextControl.change();
            $selectTextControl.valid(); 
        }
    }


</script>
<div class="modal fade">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">选取用户</h4>
            </div>
            <div class="modal-body">
                <div class="pull-right text-black">
                    <form class=" input-group input-group-sm SearchArea">

                        <input type="text" name="userName" autocomplete="off" class="form-control pull-right" placeholder="输入用户名查询">
                        <div class="input-group-btn">
                            <button type="button" class="btn btn-default" onclick="window.app.search(this);" data-search = "#UserList"><i class="fa fa-search"></i></button>
                        </div>
                    </form>
                </div>
           

                <table id="UserList" class="table table-bordered table-striped" width="100%"></table>
            </div>
            <div class="modal-footer">
                <div class="btn-group">
                    @Html.Bootstrap().LinkButton("确定", ToolBarIco.Save).Style(BootstrapStyle.Primary).Click("new selectBoxViewModel().selectThis('UserList',event)").Attribute("data-dismiss", "modal")
                    @Html.Bootstrap().LinkButton("清除", ToolBarIco.Permission).Style(BootstrapStyle.Warning).Click("new selectBoxViewModel().empty('UserList')").Attribute("data-dismiss", "modal")
                    @Html.Bootstrap().LinkButton("关闭", ToolBarIco.Close).Style(BootstrapStyle.Default).Attribute("data-dismiss", "modal")
                </div>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>